<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="js/jquery-3.2.1.js"></script>
</head>
<body>
<form action="yan.do" method="get">

<div class="form-group  col-lg-6">  
    <label for="id" class="col-sm-4 control-label">  
        验证码:  
    </label>  
    <div class="col-sm-8">  
        <input type="text" id="code" name="code" class="form-control" style="width:250px;"/>  
        <img id="imgObj" alt="验证码" src="/maven-test/validateCode.do" onclick="changeImg()"/>  
        <a href="#" onclick="changeImg()">换一张</a>  
    </div>  
</div>  
 submit<input type="submit">
</form>

  
<script type="text/javascript">  
    // 刷新图片  
    function changeImg() {  
        var imgSrc = $("#imgObj");  
        var src = imgSrc.attr("src");  
        imgSrc.attr("src", changeUrl(src));  
    }  
    //为了使每次生成图片不一致，即不让浏览器读缓存，所以需要加上时间戳  
    function changeUrl(url) {  
        var timestamp = (new Date()).valueOf();  
        var index = url.indexOf("?",url); 
        if (index > 0) {  
            url = url.substring(0, url.indexOf("?",url));  
        }  
        if ((url.indexOf("&") >= 0)) {  
            url = url + "×tamp=" + timestamp;  
        } else {  
            url = url + "?timestamp=" + timestamp;  
        }  
        return url;  
    }  
</script>  
</body>
</html>